<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Insert title here</title>
<script type="text/javascript" src="js/jquery-1.12.4.min.js"></script>

<script type="text/javascript">

$(function(){

	
	
});

function check(){

	var titleExsist = $('#titleExsist').val();

	if(titleExsist==1){
		return false;
	}

	var title = $('#title').val();
	
	var content = $('#content').val();

	var type = $('#type').val();

	if(title == ''){
		alert('标题不能为空');

		return false;
	}

	if(content == ''){
		alert('内容不能为空');

		return false;
	}

	if(type == 0){
		alert('类型不能为空');

		return false;
	}

	return true;
}

function checkTitle(){

	var title = $('#title').val();
	
	$.getJSON('CountServlet','title='+title,function(data){
		if(data.count>0){
			$('#tip').html('标题已存在');
			$('#titleExsist').val(1);
		} else {
			$('#tip').html('标题可以使用');
			$('#titleExsist').val("");
		}
	});
}

</script>

</head>
<body>
	<h1>我的工作笔记</h1>
	<form action="AddServlet" onsubmit="return check()">
		<input type="hidden" id="titleExsist" name="titleExsist">
		标题：<input type="text" name="title" id="title" onblur="checkTitle()"> <span id="tip"></span> <br/><br/>
		内容：<textarea rows="5" cols="20" id="content" name="content"></textarea> <br/><br/>
		类别：
		<select id="type" name="type">
			<option value="0">--请选择--</option>
			<option value="1">技术</option>
			<option value="2">行政</option>
			<option value="3">人事</option>
		</select><br/><br/> 
		<input type="submit" value="提交">
	</form>
</body>
</html>